@import '~@assets/styles/_variables.sass'

.ctx-menu-container
  position: fixed
  padding: 0
  cursor: pointer
  border: 1px solid #ebeef5
  z-index: 99999
  color: #646465
  font-size: $text-sz-default
  font-weight: 500
  background: #fff
  .ctx
    position: relative
    display: flex
    background-color:transparent
    .second-menu
      width: 160px !important
      background: #fff
      position: absolute
      right: -161px
      top: 0px
      border: 1px solid #ebeef5;
      border-left: none;
      box-shadow: 0 2px 12px 0 rgba(0,0,0,.1)
      border-radius: 4px
      padding-left: 0
      .ctx-item
        background: #fff
        width: 160px
        color: #3d3d3d
        font-size: 12px
    .ctx-menu
      border: 1px solid #ebeef5
      background-color: white
      position: absolute
      left: 0
      list-style: none
      min-width: 178px
      box-shadow: 0 2px 8px #A8A8A8

      .ctx-divider
        height: 1px !important
        overflow: hidden;
        background-color: #e3e3e3
        margin: 5px 12px !important

      .ctx-item
        position: relative
        display: flex
        box-sizing: border-box
        height: 28px
        line-height: 28px
        padding: 0 12px
        white-space: nowrap
        justify-content: space-between
        align-items: center

        &:focus, &:hover
          color: $text-over-color
          background-color: $grey-bg-color

        &.active:focus, &.active:hover
          color: $text-click-color


        &.disabled:focus, &.disabled:hover
          color: #818a91

